<template>
  <div>
    <h1 style="margin:10px auto;text-align:center;">全部景点</h1>  
    <van-button icon="revoke" round type="gray" @click="$router.push('/explore')" style="z-index:10;position: fixed;right:10px;bottom:10px;">返回</van-button>
    <van-grid :column-num="1" :gutter="10" :data="Scenerys">
      <van-grid-item v-for="item in Scenerys" :key="item.id">
        <img  :src="`http://localhost:3010/images/${item.scenery_img}`"/>
        <h3>{{item.scenery_title}}</h3>
      </van-grid-item>
    </van-grid>
  </div>
</template>

<script>
import httpApi from '@/http';
  export default {
    data() {
      return {
        Scenerys: []
      }
    },
    mounted(){
        //加载目的地
    httpApi.RouteApi.queryAllRouteScenery().then(res=>{
        console.log(res);
        this.Scenerys=res.data.data
      })
    }
  }
</script>

<style lang="scss" scoped>
img{
  width:100%;
  height:150px;
  border-radius: 10px;
}
</style>
<style>
.van-grid{
  padding: 5px 5px 5px 10px !important;
}
.van-grid-item__content{
  padding: 0;
  overflow: hidden;
}
</style>